<template>
	<view class="page-content">
		<u-list v-if="dataList.length" @scrolltolower="listScrollTolower">
			<view class="tj-box">
				<course-item :data="item" v-for="(item, index) in dataList" :key="index" @clickItem="clickListItem"
					style="width: 49%;margin-top: 10rpx;" :type="1">
				</course-item>
			</view>
		</u-list>
		<u-empty mode="list" v-else :customStyle="{flex:'1'}"></u-empty>
	</view>
</template>

<script>
	import {
		getCourses
	} from '@/config/api.js'

	export default {
		data() {
			return {
				dataList: [],
				name: "",
				page: 1,
				pages: 1
			}
		},
		onLoad(op) {
			this.name = op.name;

			var subData = {
				page: this.page,
				title: op.name
			}

			getCourses(subData).then(res => {
				this.dataList = this.dataList.concat(res.list);
				this.pages = res.page.pages;
				this.page++;
			});
		},
		methods: {
			clickListItem(data) {
				if (this.userInfo == null || this.userInfo == "") {
					return;
				}

				uni.navigateTo({
					url: '/pages/course/detail/detail?id=' + data.id
				})
			},
		}
	}
</script>

<style scoped>
	.tj-box {
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		align-items: flex-start;
		flex-wrap: wrap;
	}
</style>
